<template>
	<view class="wrap">
		<view class="bill-details-wrap form">
			<view v-if="!isReadonly" style="color: #fc7e0a; text-align: right; font-size: 12px">等待我审核</view>
			<!-- 单据明细 -->
			<ProblemBillDetailsViewer :period="$GC.APPROVE_PERIOD.check" :billId="model.ProblemId" billType="invoice" @detail-loaded="onDetailLoaded('details')" />
		</view>
		<view class="form-wrap" style="margin-top: 20rpx">
			<u-form class="form" :model="model" ref="uForm" labelWidth="100" labelPosition="left" :labelStyle="form_label_Style">
				<u-form-item borderBottom label="审批批语" prop="ProblemApproveStr" label-position="top" :customStyle="form_item_customStyle">
					<u--textarea
						maxlength="1000"
						autoHeight
						:count="true"
						:disabled="isReadonly"
						v-model="model.ProblemApproveStr"
						border="none"
						placeholder="请输入"
					></u--textarea>
				</u-form-item>
			</u-form>
		</view>
		<view class="approve-line" style="margin-bottom: 80rpx">
			<ProblemApproveFlowViewer :billId="model.ProblemId" billType="invoice" @detail-loaded="onDetailLoaded('flow')" />
		</view>
		<view class="bottom-fix-wrap" v-if="!isReadonly">
			<u-row gutter="10" justify="space-between">
				<u-col span="6">
					<view class="demo-layout bg-purple">
						<u-button class="btn" type="error" @click="submit('ng')">验收不合格</u-button>
					</view>
				</u-col>
				<u-col span="6">
					<view class="demo-layout bg-purple-light">
						<u-button class="btn" type="primary" @click="submit('ok')">验收合格</u-button>
					</view>
				</u-col>
			</u-row>
		</view>

		<u-picker closeOnClickOverlay :show="showPicker" @close="showPicker = false" @cancel="showPicker = false" @confirm="pickerConfirmEve" :columns="pickerColumns"></u-picker>
	</view>
</template>
<script>
const recorderManager = uni.getRecorderManager();
const innerAudioContext = uni.createInnerAudioContext();

innerAudioContext.autoplay = true;
import { BASEDOC } from '@/common/const/index';
import ProblemBillDetailsViewer from '../pub/approve-details.vue';
import ProblemApproveFlowViewer from '../pub/approve-flow.vue';
export default {
	name: 'ProblemFilter',
	components: {
		ProblemApproveFlowViewer, //审批明细
		ProblemBillDetailsViewer // 注册明细页面组件
	},
	data() {
		return {
			//form-item 自定义样式
			form_item_customStyle: {
				'font-weight': 'normal'
			},
			form_label_Style: {
				'font-weight': 'bold',
				color: '#f95151'
			},

			showPicker: false,
			pickerColumns: [],
			pickerCurrentAttrName: '',

			showStartTimeDateTimePicker: false,
			showEndTimeDateTimePicker: false,
			dateTimePickerCfg: {
				year: true,
				month: true,
				day: true,
				hour: true,
				minute: true,
				second: true
			},
			// 表单
			model: {
				pk_org: '',
				ProblemId: '',
				ProblemCode: '',
				ProblemTitle: '',
				ProblemFindByPsn: '',

				ProblemPerson: '',
				ProblemLocation: '',

				ProblemCreDate: '',
				ProblemStatrTime: '',
				ProblemEndTime: '',

				ProblemDescription: '',
				ProblemVoice: '',
				ProblemPicture: '',
				ProblemVideo: '',

				ProblemDuty: '',
				ProblemLevel: '',
				ProblemType: '',

				ProblemApproveStr: '' //审批批语
			},
			status: 'add', //表单状态

			officeSelectList: [],
			userSelectList: [],
			current: 0
		};
	},
	computed: {
		/**
		 * 表单是否只读
		 */
		isReadonly() {
			return this.status === this.$GC.STATUS.browse;
		}
	},
	onReady() {},
	onLoad(params) {
		this.status = params.status;
		this.model.ProblemId = params.ProblemId + '';

		return;
		if (this.status == this.$GC.STATUS.browse || this.status == this.$GC.STATUS.approve) {
			let queryParam = {
				ProblemId: params.ProblemId
			};
			this.$api
				.queryProblemById(queryParam)
				.then((res) => {
					if (res.success) {
						let problemData = res.data[0];
						this.model = problemData;
					}
				})
				.catch((error) => {
					this.$tool.msg('数据加载失败！');
				});
		}
	},
	methods: {
		// 明细组件以及审批组件加载完成
		onDetailLoaded(type) {},
		refInputClick(e) {
			uni.hideKeyboard();
			let refparam = {
				refType: BASEDOC.PSNDOC,
				queryCondition: {
					pk_org: ''
				}
			};
			let that = this;
			uni.navigateTo({
				url: '/pages/common/listref/listref?refparam=' + JSON.stringify(refparam),
				events: {
					refPageCallBack: function (data) {
						that.model[e] = data.refname;
					}
				},
				success: function (res) {}
			});
		},

		pickerConfirmEve(e) {
			let val = e.value[0];
			if (this.pickerCurrentAttrName) {
				this.model[this.pickerCurrentAttrName] = val;
			}
			this.showPicker = false;
		},
		pickerInputEvent(attr_name) {
			uni.hideKeyboard();
			if (attr_name == 'ProblemType') {
				this.pickerColumns = [['设备', '品质', '安全', '工艺', '环保', '人事']];
			} else if (attr_name == 'ProblemLevel') {
				this.pickerColumns = [['一般问题', '关键问题']];
			}
			this.pickerCurrentAttrName = attr_name;
			this.showPicker = true;
		},
		navTo(url) {
			uni.navigateTo({
				url: url
			});
		},
		submit(type) {
			let { ProblemId, ProblemProperty, ProblemApproveStr } = this.model;
			let param = {
				ProblemId: ProblemId,
				ProblemApproveStr: ProblemApproveStr
			};

			// 无效问题
			if (type == 'ng') {
				param.ProblemProperty = '问题验收不合格';
			} else {
				param.ProblemProperty = '问题验收合格';
			}

			this.$api
				.checkProblem(param)
				.then((res) => {
					let msgStr = '';
					if (res.code != 200) {
						let msgArrs = JSON.parse(res.message);
						if (Array.isArray(msgArrs)) {
							msgArrs.map((item) => {
								msgStr += item;
							});
						}
					} else {
						msgStr = res.message;
					}
					uni.showModal({
						title: '提示',
						content: msgStr,
						showCancel: false,
						success: function () {
							if (res.success) {
								// 跳转到待办页
								/* uni.navigateTo({
									url: '/pages/bpm/myTaskTodo/myTaskTodo'
								}); */
								uni.navigateBack();
							}
						}
					});
				})
				.catch((error) => {
					this.$tool.msg('操作失败！');
				});
		},
		cancel() {
			uni.navigateBack();
		},
		dateTimePickerCallBack(obj, attr_name) {
			if (attr_name == '') return;
			if (obj == '') {
				this.model[attr_name] = '';
			} else {
				let dateVal = obj.year + '-' + obj.month + '-' + obj.day + ' ';
				let timeVal = obj.hour + ':' + obj.minute + ':' + obj.second;
				this.model[attr_name] = dateVal + timeVal;
			}
		}
	}
};
</script>
<style scoped lang="scss">
.wrap {
	font-family: $font-pingfang;
}
.form-wrap {
	background-color: white;
	font-family: $font-pingfang;
}
.wrap {
	padding: 20rpx;
	background-color: $u-bg-color;
}
.u-row {
	margin: 10rpx 0;
}
</style>
